<div class="connection-tab large-12 column connectionList">

	<span id="errRequest2"><center>No connection </center></span>

	<?php foreach ($connection_page->items as $value) { ?>
	<div id="connection_id_<?= $value->uat->id ?>"class="con-inner large-12 column connection_member">
		<div class="conn-dptmb large-2 column" style="background:url(<?= IMAGE_URL_SMALL.$value->uat->profile_pic ?>);background-size:cover;">
		</div>
		<div class="coninfo large-7 column">
			<p><a target='_blank' href="<?=BASE_URI.'profile?bhd='.$value->uat->id?>"><?= $value->uat->fname.' '.$value->uat->lname ?></a></p>
			<p style="margin-top:-1.3rem;">Web Programmer</p>
			<p style="margin-top:-1.6rem;"><small>105 mutual connections</small></p>
		</div>
		<div class="conbtn large-3 text-right column">
			<a data-id="<?= $value->uat->id ?>" class="tiny radius button"> Connected</a>
		</div>
	</div>
	<?php  }?>


	<?php if($connection_page->total_pages > 1) { ?>
	<div class="large-12 columns">
		<ul class="connection-pagination right pagination"> 
			<li class="arrow unavailable"><a href="">&laquo;</a></li> 
			<li class="current"><a href="">1</a></li> 
			<li><a href="">2</a></li> 
			<li><a href="">3</a></li> 
			<li><a href="">4</a></li> 
			<li class="unavailable"><a href="">&hellip;</a></li> 
			<li><a href="">5</a></li>
			<li><a href="">6</a></li> 
			<li class="arrow"><a href="">&raquo;</a>
			</li> 
		</ul>
	</div> 
	<?php }?>
</div>


<script>
$('.connectedbtn')
    .data('textToggle', Disconnect)
    .hover(function (e) {
        var that = $(this);
        
        // get the text from data attribute
        var textToSet = that.data('textToggle');
        
        // save the current text so it can be reverted
        that.data('textToggle', that.text());
        
        // set the new text
        that.text(textToSet);
    }, function (e) {
        var that = $(this);
        
        // get the text from data attribute
        var textToSet = that.data('textToggle');
        
        // save the current text so it can be reverted
        that.data('textToggle', that.text());
        
        // set the new text
        that.text(textToSet);
    });
</script>


